<template>
	<view class="order">
		<!-- <view class="top headline">
			<uni-icons type="arrowleft" size="24" class="left" color="#999" @click="commonality.back()" />
			搜索结果
		</view> -->
		<ul>
			<li class="order_list">
				<view v-for="item in initData" :key="item.value">
					<view class="number">
						订单编号：{{ item.orderSn }}
						<!-- <text class="right" v-if="item.frontOrderStatus!=null">{{item.frontOrderStatus.desp}}</text> -->
						<!-- <text class="right">等待发货</text>
          <text class="right">已发货，待收货</text>
          <text class="right">已完成</text> -->
					</view>
					<view class="msg" @click="go_commoditydetails(item.id)">
						<image :src="item.image" class="imgthumb" :lazy-load="true" mode="aspectFill" />
						<view class="text">
							<view class="title">{{ item.goodsName }}</view>
							<view v-for="sku in item.sku" :key="sku.value">
								<view class="trait">{{ sku }}</view>
							</view>
							<text class="right">×1</text>

							<view class="price">￥{{ item.orderPrice }}</view>
						</view>
					</view>
					<view class="total">
						<text class="quantity">共1件</text>
						合计：
						<text class="price">￥{{ item.actualPrice }}</text>
					</view>
					<view class="operation" v-if="item.frontOrderStatus != null">
						<text v-if="item.frontOrderStatus.value == 1">修改商品</text>
						<text @click="go_del(item)" v-if="item.frontOrderStatus.value != 4 && item.frontOrderStatus.value != 3">删除订单</text>
						<text v-if="item.frontOrderStatus.value == 1" @click="go_pay(item)">去付款</text>
						<!-- <text>完成</text> -->
						<text v-if="item.frontOrderStatus.value == 4" @click="changepro(item,2)">申请换货</text>
						<text v-if="item.frontOrderStatus.value == 4" @click="changepro(item,1)">申请退款</text>
						<!--根据终端进行是否上传买家秀功能-->
						<text v-if="item.frontOrderStatus.value == 5">上传买家秀</text>
					</view>
				</view>
			</li>
		</ul>
		<view class="pagination" v-if="showresult">
			<view class="left" :class="{ forbid: paging.page == 1 }" @click="prev">
				<uni-icons type="arrowleft" size="20" color="#fff" class="icons" />
				上一页
			</view>
			<view class="center">{{ paging.page }}/{{ paging.total }}</view>
			<view class="right" :class="{ forbid: paging.page == paging.total }" @click="next">
				下一页
				<uni-icons type="arrowright" size="20" color="#fff" class="icons" />
			</view>
		</view>
		
		<view v-show="shownoresult" class="notavailable">
			<image src="../../../static/img/notavailable.png" mode="widthFix"></image>
			<view class="nottext">暂时没有数据</view>
		</view>
		<view class="gotop"></view>
	</view>
</template>
<script>
import { uniIcons } from '@dcloudio/uni-ui';
import search from '../../../servers/order/searchresult.js';
import jsonUtil from '../../../common/jsonUtil.js';
export default {
	components: { uniIcons },
	data() {
		return {
			initData: [], //初始化数据
			is_go_top: false,
			obj: {},
			is_all: false,
			shownoresult: false,
			showresult: true,
			paging: {
				page: 1,
				total: 100
			}
		};
	},
	onPageScroll: function(e) {
		//nvue暂不支持滚动监听，可用bindingx代替
		if (e.scrollTop > 200) {
			this.is_go_top = true;
		} else {
			this.is_go_top = false;
		}
	},
	mounted() {
		// var _this = this;
		// uni.getStorage({
		// 	key: 'shopordersearchresult',
		// 	success: function(res) {
		// 		_this.obj = res.data;
		// 	}
		// });
		this.getDate();
		
	},
	onLoad(option) {
		if(option.obj){
			this.obj=option.obj
			
		}
	},
	methods: {
		getDate() {
			// var parame = this.obj;
			// parame = {
			// 	createStartTime: this.obj.createStartTime,
			// 	createEndTime: this.obj.createEndTime,
			// 	contactUser: this.obj.contactUser,
			// 	orderSn: this.obj.orderno,
			// 	contactPhone: this.obj.contactPhone,
			// 	currentPage: this.paging.page,
			// 	pageSize: 10
			// };
			this.obj.currentPage=this.paging.page
			this.obj.pageSize=10
			 jsonUtil.deleteEmptyProperty(this.obj);
			
			console.log(this.obj)
			search
				.initData(this.obj)
				.then(res => {
					if (res.data.length != 0) {
					
						this.paging.total = Math.ceil(res.data.total / res.data.size);
						this.initData = [];
						this.initData = res.data.records.map(v => {
							v.image = this.imgCDNUrl + v.productImg;
							var sku = [];
							if (v.productSkuDesp) {
								sku = v.productSkuDesp.split(',');
							}
							v.sku = sku;
							return v;
						});
					} else {
						this.shownoresult = true;
						this.showresult = false;
					}
				})
				.catch(err => {
					console.log(new Error('请检查网络后重试'));
				});
		},
		go_url(url) {
			uni.navigateTo({
				url: url
			});
		},
		go_search() {
			uni.navigateTo({
				url: '/pages/shop/order/find'
			});
		},
		go_active(e) {
			console.log(e);
			this.list_active = e;
			this.paging.page = 1;
			var obj = { frontOrderStatus: e };
			this.getDate();
		},
		go_del(e) {
			var flag = e.frontOrderStatus.value;
			var id = e.id;
			if (flag == 3 || flag == 4) {
				//弹出不让删除
			} else {
				//请求删除接口
			}
		},
		changepro(item, num) {
			uni.navigateTo({
				url: './after?item=' + JSON.stringify(item) + '&num=' + num
			})
		},
		go_pay(e) {
			var da = {
				id: e.orderId,
				price: e.orderPrice
			}
			uni.setStorage({
				key: 'order',
				data: da,
				success: function() {
					uni.navigateTo({
						url: '/pages/shop/order/pay'
					});
				}
			});
		},
		go_commoditydetails(e) {
			this.commonality.route_baling('/pages/shop/order/commoditydetails','commoditydetails',e)
		},
		next() {
			if (this.paging.page < this.paging.total) {
				this.paging.page += 1;
				this.getDate();
			}
			
		},
		prev() {
			if (this.paging.page > 1) {
				this.paging.page -= 1;
				this.getDate();
			}
			
		}
	}
};
</script>
<style lang="less" scoped>
.order {
	min-height: 100%;
	background: #fff;
	.headline {
		.find {
			position: absolute;
			right: 20rpx;
			image {
				width: 38rpx;
				height: 38rpx;
			}
		}
	}
	.list {
		display: flex;
		border-bottom: 1rpx solid #e1e1e1; /*no*/
		view {
			position: relative;
			flex: 1;
			text-align: center;
			line-height: 89rpx;
		}
		view.active {
			color: #bd3c8c;
		}
		view.active::after {
			position: absolute;
			content: '';
			bottom: 21rpx;
			left: 50%;
			width: 49rpx;
			height: 3rpx;
			background: #bd3c8c;
			transform: translate(-50%, 0);
		}
	}
	ul {
		padding: 20rpx;
		font-size: 26rpx;
		li {
			box-shadow: 3rpx 0 20rpx rgba(206, 205, 204, 0.35);
			border-radius: 10rpx;
			.number {
				padding: 0 20rpx;
				border-bottom: 1rpx solid #e1e1e1; /*no*/
				font-size: 28rpx;
				line-height: 92rpx;
				.right {
					font-size: 26rpx;
					color: #bd3c8c;
				}
			}
			.msg {
				padding: 20rpx;
				display: flex;
				.imgthumb {
					width: 218rpx;
					height: 218rpx;
					border-radius: 10rpx;
				}
				.text {
					flex: 1;
					margin-left: 32rpx;
					.title {
						line-height: 44rpx;
						margin-bottom: 16rpx;
					}
					.trait {
						color: #999;
						line-height: 38rpx;
						.right {
							color: #000;
						}
					}
					.price {
						line-height: 44rpx;
					}
				}
			}
			.total {
				text-align: right;
				line-height: 40rpx;
				padding: 0 20rpx;
				.quantity {
					color: #999;
					margin-right: 20rpx;
				}
				.price {
					font-size: 30rpx;
				}
			}
			.operation {
				text-align: right;
				padding: 46rpx 0;
				text {
					display: inline-block;
					text-align: center;
					width: 180rpx;
					line-height: 64rpx;
					border: 1px solid #e1e1e1; /*no*/
					border-radius: 32rpx;
					margin: 0 20rpx 0 35rpx;
					box-sizing: border-box;
				}
			}
		}
	}
}
</style>
